<template>
  <div>
    <p>{{ count }}</p>
    <button @click="add">+</button>
  </div>
</template>

<script lang="ts">
import { defineComponent, ref } from "vue";
export default defineComponent({
  name: "test-child",
  setup(_, { emit }) {
    const count = ref(0);

    function add() {
      count.value++;
      console.log("this is a method from child component");
      /**
       * 自定义事件名 child-click，并传递 count 的值
       */
      emit("child-click", count.value);
    }
    return {
      count,
      add
    };
  }
});
</script>

<style></style>
